<template>
  <div class="top"><input type="checkbox" v-model="isAllChecked" />全选</div>
</template>

<script>
  import { mapGetters,mapMutations } from 'vuex';
export default {
  name: "CartHeader",
  computed: {
    //mapGetters放在计算属性里面
    ...mapGetters(['total','selectTotal']),
    //是否全选
    isAllChecked: {
      get() {
        //一定是return 一个布尔值
        // return this.$store.getters.total === this.$store.getters.selectTotal;

        //简写
        return this.total === this.selectTotal;
      },
      set(value) {
        // this.$store.commit('changeAll',value);

        //简写
        this.changeAll(value)
      },
    },
  },
  methods:{
    //mapMutations要写在methods里
    ...mapMutations(['changeAll']),
  },
};
</script>

<style>
.top {
  height: 40px;
  display: flex;
  align-items: center;
  background-color: pink;
}

.top > input {
  width: 20px;
  height: 20px;
  margin: 0 20px;
}
</style>
